<template>
	<view class="content">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="backText">{{$t('back')}}</block>
			<block slot="content"><text class="text-black text-bold">{{$t('repair').repairRecord}}</text></block>
		</cu-custom>
		<view class="margin-top"></view>
		<view v-for="(item,index) in leavelist" :key="index" class="list-item solid-bottom" @click="onClick(item.id)">
			<view class="flex">
				<image class="img-head round" mode="aspectFill" :src="$constant.IMG_VERSION==$constant.OSS?item.personphoto:$constant.BASEURL+item.personphoto"></image>
				<view class="padding-left">
					<view>{{$t('repair').whoSubmit}} {{item.username}}</view>
					<view class="margin-top-xsm text-gray text-sm">{{$t('repair').repairReason}}: {{item.vname}}</view>
					<view class="text-gray text-sm">{{$t('repair').repairTime}}: {{DateFormat(item.leavestime.time,'3')}}</view>
					<view :class="item.lstatus==0?'text-green':item.lstatus==1?'text-orange':'text-red'" class="margin-top-xsm text-sm">
						{{item.lstatus==0?$t('repair').reviewPassed:item.lstatus==1?item.personname+' '+$t('repair').inApproval:$t('repair').refused}}
					</view>
				</view>
			</view>
			<view class="text-gray text-sm padding-top-8">{{DateFormat(item.create_date.time)}}</view>
		</view>
		<no-more :show="!leavelist.length>0" :text="$t('repair').noRepair"></no-more>
		<uni-load-more :status="status" :size="20" :content-text="contentText" />
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	var utils = require('@/common/utils.js');
	export default {
		components: {
			uniLoadMore
		},
		data() {
			return {
				leavelist: [],
				page: 1,
				rows: 20,
				reload: false, //是否重新加载
				status: 'more',
				contentText: {
					contentrefresh: this.$t('loading'),
				}
			}
		},
		onReachBottom() {
			if (this.status == 'noMore') return
			this.status = 'more';
			this.GetData()
		},
		onShow() {
			uni.showLoading({
				title:this.$t('loading'),
			})
			this.GetData()
		},
		onLoad() {
			this.$constant.checkUserInfo()
		},
		methods: {
			onClick(id) {
				uni.navigateTo({
					url: `repair-detail?leaveid=${id}`
				})
			},
			GetData() {
				if (this.page > 1) {
					//说明已有数据，目前处于上拉加载
					this.status = 'loading';
				}

				uni.request({
					url: this.$constant.BASEURL + this.$constant.GET_LEAVE_LIST,
					method: "POST",
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						userid: getApp().globalData.userid,
						page: this.page,
						rows: this.rows,
						apptype:2
					},
					complete() {
						uni.hideLoading()
					},
					success: (res) => {
						console.log(res)
						if (res.data.code == 0) {
							let list = res.data.data
							if (list.length > 0) {
								this.leavelist = this.reload ? list : this.leavelist.concat(list)
								this.page++;
								this.reload = false;
								//当请求的数据少于rows说明已经没有更多了，不需要再重新请求了
								if (list.length < this.rows) {
									this.status = 'noMore'
								}
							} else {
								this.status = 'noMore'
							}
						} else {
							uni.showModal({
								content: res.data.message,
								showCancel: false,
								cancelText: this.$t('sure'),
								confirmText: this.$t('cancel')
							})
						}
					}
				});
			},
			DateFormat(timestamp, vminimum, stime) {
				return utils.DateFormat(timestamp, vminimum, stime,this.$_i18n.locale)
			}
		}
	}
</script>

<style>
	.list-item {
		background-color: #ffffff;
		padding: 25upx 25upx;
		display: flex;
		min-height: 100upx;
		justify-content: space-between;
	}

	.margin-top-xsm {
		margin-top: 10upx;
	}

	.padding-top-8 {
		padding-top: 8upx;
	}

	.img-head {
		width: 80upx;
		height: 80upx;
		top: 0;
	}
	.text-green{
		color: #1cbbb4;
	}
</style>
